import {View,Text,TouchableOpacity,StyleSheet, ScrollView,Alert,FlatList,Modal,Image} from 'react-native';
import { useSelector,useDispatch } from 'react-redux';
import { useEffect, useState } from 'react';
import { MaterialCommunityIcons } from '@expo/vector-icons';
import '../../global'
const showAlert = (msg,fun) =>
  Alert.alert(
    "提示",
    msg,
    [
      {
        text: "确认",
        onPress: fun,
        style: "cancel",
      },
    ],
    {
      cancelable: false,
    }
  );
const Message = ({navigation}) => {
    const li=useSelector(state=>state.list);
    const [list,setList]=useState([{}])
    useEffect(()=>{
      fetch('https://wx.qasdwer.top:8080/user/getmessage',{
        method:'post',
        headers:{
          'content-type':'application/json;charset=utf-8'
        },
        body:JSON.stringify({user_number:li.account,username:li.name})
      })
  .then(res=>res.json())
  .then(res=>{ 
    setList(res)
  })
  .catch((error)=>{
      console.log("Error");
      throw error;
    });
  },[])
    
        return (
        <ScrollView style={{backgroundColor:'white'}}>
            {
              list.map((item,index)=>{
                return(
                <TouchableOpacity onPress={()=>{
                  fetch('https://wx.qasdwer.top:8080/user/getmessagedetail',{
                  method:'post',
                  headers:{
                    'content-type':'application/json;charset=utf-8'
                  },
                  body:JSON.stringify({key0:item.key0})
                  })
                  .then(res=>res.json())
                  .then(res=>{
                      navigation.navigate('ShareDetail',{listcon:res[0]})
              })
                }}
                key = {index}
                style={{borderBottomWidth:1.5,borderColor:'#F5F5F5'}}
                >
                  <View style={styles.list}>
                    <View style={styles.ring}>
                    <Image source={require('../../assets/image/消息.png')} style={{width:65,height:65}}/>
                    </View>
                    <Text style={styles.txt1}>您收到了一条评论！</Text>
                    <Text style={styles.txt2}>用户{item.username}评论了您的动态！</Text>
                    <Text style={styles.time}>{item.time0}</Text>
                  </View>
                </TouchableOpacity>
                )
              })
            }
        </ScrollView>
        )  
}

const styles=StyleSheet.create({
  list:{
    backgroundColor:'white',
    height:changeH(150),
    position:'relative'
  },
  ring:{
    width:70,
    height:70,
    borderRadius:70,
    marginLeft:changeW(40),
    marginTop:changeH(15),
    justifyContent:'center',
    alignItems:'center'
  },
  txt1:{
    position:'absolute',
    top:changeH(20),
    fontSize:changeW(30),
    left:changeW(180)
  },
  txt2:{
    position:'absolute',
    top:changeH(90),
    fontSize:changeW(20),
    left:changeW(180),
    color:'rgba(0,0,0,0.5)'
  },
  time:{
    position:'absolute',
    top:changeH(50),
    fontSize:changeW(20),
    right:changeW(50),
    color:'rgba(0,0,0,0.5)'
  }
})

export default Message